<!--
 * FilePath     : \src\components\selector\frequencySelector.vue
 * Author       : 杨欣欣
 * Date         : 2025-01-19 10:45
 * LastEditors  : 郭鹏超
 * LastEditTime : 2025-03-04 09:47
 * Description  : 频次选择器
 * CodeIterationRecord: 
 -->
<template>
  <el-cascader
    :props="cascaderProps"
    :options="options"
    v-model="frequencyID"
    @change="changeFrequency"
    :show-all-levels="false"
    filterable
  />
</template>

<script lang="ts" setup>
const { commonDictionaryStore } = useStore();
const props = defineProps<{
  frequencies?: CascadeOptionsView[];
}>();

const frequencyID = defineModel<number>("frequencyID", {
  required: true
});
const frequencyName = defineModel<string>("frequencyName", { default: "" });
const emit = defineEmits(["select"]);

commonDictionaryStore.fetchDataIfNeeded("frequencyList", frequencyService.getFrequency, { visibleFlag: true });

// 频次列表
const options = computed(() => {
  return (props.frequencies ?? []).length > 0 ? props.frequencies ?? [] : commonDictionaryStore?.frequencyList ?? [];
});

// 级联选择器属性
const cascaderProps = {
  expandTrigger: "hover" as const,
  emitPath: false
};

/**
 * @description: 选择频次回调，根据字典ID获取频次信息
 * @param frequencyID 频次ID
 * @return
 */
const changeFrequency = (frequencyID: number) => {
  const frequency = options
    .value!.flatMap((frequenciesCategory) => frequenciesCategory.children ?? [])
    .find((frequency) => frequencyID == frequency.value);
  frequency && emit("select", frequency);
  frequencyName.value = frequency?.label ?? "";
};
</script>
